<template>
  <div class="ques_detail" @click="goquesdetail(item.fqId)" >
    <div class="detail_img">
      <img :src="$store.state.domain+item.picture" alt="">
    </div>
    <div class="detail_info">
      <h6>{{item.title}}</h6>
      <p> {{item.question}}</p>
      <div>
        <span class="ce_num"><em></em>{{item.useramount}}</span>
        <span class="pj_num"><em></em>{{item.commentamount}}</span>
      </div>
    </div>
  </div>
</template>
<script>
    export default {
        name: 'quesItem',
        props:{
            item: Object
        },
        data(){
          return{
            
          }
        },
        methods: {
          goquesdetail(fqId){
            this.$router.push({
              path: '/questiondetail',
              query: {
                fqId: fqId
              }
            })
          }
        },
        mounted() {
            
        }
    }
</script>
<style lang="less" scoped>
    .tit{
      font-size: .4rem;
      color: #333333;
      font-weight: normal;
    }
    .ques_detail{
      padding-left: .28rem;
      height: 2.266667rem;
      border-top: 1px solid #F2F2F2;
      padding-top: .28rem;
      padding-bottom: .28rem;
      padding-right: .373333rem;
      box-sizing: border-box;
      .flex;
      .justify-content(flex-start);
      .detail_img{
        width: 1.653333rem;
        height: 1.653333rem;
        overflow: hidden;
        border-radius: .266667rem;
        margin-right: .466667rem;
        position: relative;

        img{
          width: auto;
          position: absolute;
          left: 50%;
          height: 100%;
          transform: translateX(-50%);
        }
      }
    .detail_info{
        flex:1;
        width: 0;
        h6{
          .tit;
          line-height: .666667rem;
          overflow: hidden;/*超出部分隐藏*/
          white-space: nowrap;/*不换行*/
          text-overflow:ellipsis;
        }
        p{
          color: #666;
          font-size: .346667rem;
          line-height: .666667rem;
          overflow: hidden;/*超出部分隐藏*/
          white-space: nowrap;/*不换行*/
          text-overflow:ellipsis;
        }
        div{
          font-size: .293333rem;
          color: #999;
          .flex;
          .align-items(center);
          height: .32rem;
          line-height: .32rem;
          span{
            display: inline-block;
            width: 50%;
            .flex;
            .align-items(center);
            &.ce_num{
              em{
                background: url('../assets/question/w_num@2x.png') no-repeat center;
                background-size: contain;
              }
            }
            &.pj_num{
              em{
                background: url('../assets/question/pj_num@2x.png') no-repeat center;
                background-size: contain;
              }
                
            }
            em{
              width: .253333rem;
              height: .28rem;
              margin-right: 2px;
              display: inline-block;
              
            }
          }
        }
      }
    }
</style>
